{% include "partial/header.html" %}
<main class="container">
    <div class="install">
        <h1>采集的文章</h1>
        <table id="list" lay-filter="list"></table>
    </div>
</main>
{% include "partial/footer.html" %}
<script type="text/html" id="toolbar">
    <div class="layui-btn-container">
        <button class="layui-btn layui-btn-sm layui-btn-primary" lay-event="delete">批量删除</button>
    </div>
</script>
<script type="text/html" id="control">
    <a class="layui-btn layui-btn-xs" lay-event="catch">重抓</a>
    <a class="layui-btn layui-btn-xs" lay-event="view">查看</a>
    <a class="layui-btn layui-btn-xs" lay-event="publish">发布</a>
    <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
</script>
<script>
    layui.use(['table', 'layer', 'form', 'laytpl'], function(){
        let table  = layui.table;
        let layer  = layui.layer;
        let form   = layui.form;
        let $ = layui.$;

        table.render({
            elem: '#list'
            ,limit: 20
            ,url: '/api/article/list'
            ,page: true
            ,toolbar: '#toolbar'
            ,cols: [[
                {type:'checkbox', fixed: 'left'}
                ,{field: 'id', title: 'ID', width:80}
                ,{field: 'title', title: '标题', cellMinWidth:200}
                ,{field: 'origin_url', title: '源链接', width:250, templet: function(d){
                        return '<a href="'+d.origin_url+'" target="_blank">'+d.origin_url+'</a>';
                    }
                }
                ,{field: 'status', title: '状态', edit: 'text', width:100, templet: function(d){
                        return d.status === 3 ? "无效数据" : d.status === 2 ? "采集中" : d.status === 1 ? "有效数据" : d.status === 0 ? "待采集" : "其他数据";
                    }
                }
                ,{fixed: 'right', width:220, align:'center', toolbar: '#control'}
            ]]
        });
        table.on('toolbar(list)', function(obj){
            var checkStatus = table.checkStatus(obj.config.id);
            switch(obj.event){
                case 'delete':
                    var data = checkStatus.data;
                    layer.confirm('真的删除这些数据源吗？', function(index){
                        layer.close(index);
                        for(let i in data) {
                            let item = data[i];
                            $.post("/api/article/delete", {id: item.id}, function(res) {
                                layer.msg(res.msg);
                            }, 'json');
                        }
                        setTimeout(function(){
                            table.reload('list');
                        }, 2000);
                    });
                    break;
            };
        });
        table.on('tool(list)', function(obj){
            let data = obj.data;
            let layEvent = obj.event;
            if(layEvent === 'del'){
                layer.confirm('真的删除该条数据吗？', function(index){
                    $.post("/api/article/delete", {id: data.id}, function(res) {
                        if(res.code === 0) {
                            obj.del();
                            layer.close(index);
                        }
                        layer.msg(res.msg);
                    }, 'json');
                });
            } else if(layEvent === 'view'){
                layer.open({
                    type: 1,
                    title: data.title || '未采集到标题',
                    area: "800px",
                    content: '<div class="padding-normal">'+(data.content || '未采集到内容')+'</div>',
                    btn: "确定",
                    btnAlign: 'c',
                })
            } else if(layEvent === 'catch'){
                $.post("/api/article/catch", {id: data.id}, function(res) {
                    layer.msg(res.msg);
                }, 'json');
            } else if(layEvent === 'publish'){
                if(data.status !== 1) {
                    return layer.msg("该条记录不是有效内容，无法发布");
                }
                layer.confirm('本采集器不能判断是否是重复发布，真的发布该内容吗？', function(index){
                    $.post("/api/article/publish", {id: data.id}, function(res) {
                        layer.msg(res.msg);
                    }, 'json');
                });
            }
        });
    });
</script>